<template>
	<view class="hd-paytel-container">
    <view class="tel-content flex-column">
      <view class="tel-txt">
        请输入您的手机号
      </view>
      <rh-tel v-model="phonenumber"></rh-tel>
    </view>
		<rh-submit-btn text="下一步" class-name="special" color="#23994f" :submit-action="submit"></rh-submit-btn>
	</view>
</template>

<script>
	import {isTel} from '@/script/tools.js'
	import {sendCode} from '@/api/common/index.js'
	export default {
		data() {
			return {
				phonenumber: '',
			}
		},
		mounted() {
			let _self = this
		},
		methods: {
			submit(val){
				let _self = this, {query} = this.$route
				return new Promise((resolve, reject) => {
					if(!isTel(_self.phonenumber)){
						_self.$attention.noIcon('手机号格式不对')
						reject(false)
					}else{
						sendCode(_self.phonenumber).then(res => {
							uni.setStorage({
								key: `icar-wxtel`,
								data: _self.phonenumber,
								success: () => {
									_self.$$router.replace({name: 'registerCode', query})
									resolve(true)
								}
							})
						}).finally(() => {
							resolve(true)
						})
					}
				})
			},
		}

	}
</script>
<style lang="scss" scoped>
  // @include fontStyle(#666, 24rpx);
	@mixin fontStyle($color, $size, $weight: 500) {
		color: $color;
		font-size: $size;
		font-weight: $weight;
	}
	.hd-paytel-container{
		background-color: #fff;
		height: 100vh;
    padding: 80rpx 30rpx 0;
    .tel-content{
      .tel-txt{
        @include fontStyle(#3D3D3D, 32rpx);
        margin-bottom: 100rpx;
      }
    }
	}

</style>


